<template>
	<view class="u-p-20">
		<view class="u-p-20 bg-white rounded-10">
			<view class="" v-if="message == 'ok'">
				<text class="flex u-p-y-20 font u-border-bottom">{{com}}：:{{nu}}</text>
				<text class="flex u-p-y-10" style="line-height: 40rpx;">【收货地址】：{{address.province+' '+address.city+' '+address.area+'  '+address.detail+','+address.phone}}</text>
				<view class="u-p-l-20">
					<u-time-line>
						<u-time-line-item nodeTop="2" v-for="(item,index) in list" :key="index">
							<template v-slot:node>
								<view class="u-node" style="background: #19be6b;">
									<u-icon name="car-fill" color="#fff" :size="24"></u-icon>
								</view>
							</template>
							<template v-slot:content>
								<view>
									<view class="u-order-title">{{item.status}}</view>
									<view class="u-order-desc">{{item.context}}</view>
									<view class="u-order-time">{{item.time}}</view>
                  <!-- <view class="u-order-title">带区间</view>
                  <view class="u-order-desc">[自提柜]您的快件已放在楼下侧门，直走前方53.6米，左拐约10步，再右拐直走，见一红灯笼停下，叩门三下，喊“芝麻开门”即可。</view>
                  <view class="u-order-time">2019-05-08 12:12</view> -->
								</view>
							</template>
						</u-time-line-item>
					</u-time-line>
				</view>
			</view>
			<view class="text-center" v-else>
				<text>{{message || '暂无物流信息，请等待！'}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import { OrderCenterApi } from '@/api/serves.js'
	export default {
		data() {
			return {
				form: {},
				list: [],
        message: '',
        com:'', //快递公司
        nu:'', //快递 编号
				address: {},
			}
		},
		onLoad(options) {
			console.log(options);
			let info = JSON.parse(options.info)
			this.form = info
			this._initData()
		},
		methods: {
			_initData() {
				this.$ShowLoading()
				OrderCenterApi.demand_Courier(this.form).then(res => {
					this.$HideLoading()
				  console.log('物流详情', res);
					if(res.code == 1){
						this.list = res.data.res.data
            this.message = res.data.res.message
            this.nu =   res.data.res.nu
            this.com =   res.data.delivery
            this.address = res.data.address
					}else {
					this.$Toast(res.msg)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.u-node {
		width: 44rpx;
		height: 44rpx;
		border-radius: 100rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #d0d0d0;
	}
	
	.u-order-desc {
		color: rgb(150, 150, 150);
		font-size: 28rpx;
		margin-bottom: 6rpx;
	}
	
	.u-order-time {
		color: rgb(200, 200, 200);
		font-size: 26rpx;
	}
</style>
